<%--
  Created by IntelliJ IDEA.
  User: WuLianFa
  Date: 2018/5/22 0022
  Time: 上午 10:06
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
    request.setCharacterEncoding("UTF-8");
    String path = request.getContextPath();
%>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>增加物品信息</title>
    <script type="text/javascript" src="<%=path%>/My97DatePicker/WdatePicker.js"></script>
    <link rel="stylesheet" type="text/css" href="<%=path%>/CSS/backLayout.css">
    <script type="text/javascript" src="<%=path%>/JQuery/jquery-1.8.2.js"></script>
    <%@ include file="/WEB-INF/JSP/ajax.jsp" %>
    <script src="<%=path%>/easyUI1.4.1/jquery.easyui.min.js"></script>
    <script src="<%=path%>/easyUI1.4.1/locale/easyui-lang-zh_CN.js"></script>
    <link href="<%=path%>/easyUI1.4.1/themes/default/easyui.css" rel="stylesheet"/>
    <link href="<%=path%>/easyUI1.4.1/themes/icon.css" rel="stylesheet"/>
</head>
<body style="background: #f5f5f5">
<div class="main">
    <div class="weizhi">
        仓库管理>>物品信息管理>>新增
    </div>
    <div class="div_body" style="box-shadow: 0 0 5px #cccccc;height: 1000px">
        <div class="div_form">
            <form action="<%=path%>/DrivingSys/addGoodsMassage" id="checkInput" onsubmit="return checkSubmit();"
                  method="post">
                <div class="jczl">
                    <div class="div_input_hang">
                        <div class="input_hang">
                            <span class="gn_name">物品名称&nbsp;:&nbsp;</span>
                            <input id="goodsname" type="text" class="goodsname" name="wpName" maxlength="40"
                            >
                        </div>
                        <div class="input_hang">
                            <span class="gn_name">物品类型&nbsp;:&nbsp;</span>
                            <select name="wpType" id="wpType" class="typeOptionAppendTo">
                                <option>选择物品类型</option>

                            </select> &nbsp;&nbsp;<a style="font-size: 7px;" href="javascript:void(0)"
                                                     onclick="showTypeModel()">...</a>
                        </div>
                    </div>
                    <div class="div_input_hang">
                        <div class="input_hang">
                            <span class="gn_name">规格编号&nbsp;:&nbsp;</span>
                            <select name="wpGgid" id="wpGgid" class="specificationOptionAppendTo">
                                <option>选择规格编号</option>
                            </select> &nbsp;&nbsp;<a style="font-size: 7px;" href="javascript:void(0)"
                                                     onclick="showSpecificationModel()">...</a>
                        </div>
                        <div class="input_hang">
                            <span class="gn_name">物品单价&nbsp;:&nbsp;</span>
                            <input id="goodsprice" type="text" class="goodsprice" name="wpPrice" maxlength="10"
                            >
                        </div>
                    </div>
                </div>
                <div class="div_tj">
                    <div>
                        <input type="submit" class="input_submit bc" value="">
                    </div>
                    <div>
                        <input type="button" class="input_back fh" value="" onclick="back()"/>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<%--自定义类型窗口--%>
<div id="customTypeModel">
    <table>
        <thead>
        <tr>
            <th style="font-size: smaller">类型名称</th>
            <th style="font-size: smaller">操作</th>
        </tr>
        </thead>
        <tbody class="typeAppendTo">
        <%--拼接区--%>
        </tbody>
    </table>
</div>

<%--增加类型窗口--%>
<div id="addtypemodel">
    请输入类型名：<input id="addtypemodelinput" type="text" placeholder="请输入要增加的类型名！">
</div>

<%--自定义规格窗口--%>
<div id="customSpecificationModel">
    <table>
        <thead>
        <tr>
            <th style="font-size: smaller">类型名称</th>
            <th style="font-size: smaller">操作</th>
        </tr>
        </thead>
        <tbody class="specificationAppendTo">
        <%--拼接区--%>
        </tbody>
    </table>
</div>

<%--增加规格窗口--%>
<div id="addspecificationmodel">
    请输入规格名：<input id="addspecificationmodelinput" type="text" placeholder="请输入要增加的规格名！">
</div>

</body>
<script type="text/javascript">
    $(document).ready(function () {
        //初始化类型下拉菜单
        initializesTheTypeTropDownMenu();
        //初始化规格下拉菜单
        initializesTheSpecificationTropDownMenu();
        //加载的时候，要把你的模态div先隐藏
        $("#addtypemodel").css("display", "none");
        $("#addspecificationmodel").css("display", "none");
        //弹出添加成功窗口
        var addFlag = "${addFlag}"
        if (addFlag == null || addFlag == '') {

        } else {
            editAlert();
        }
    })

    //初始化类型下拉菜单
    function initializesTheTypeTropDownMenu() {
        $.ajax({
            url: 'queryAllTypeMassageController', //请求的url
            type: 'post', //请求的方式
            success: function (data) {
                //给页面类型下拉菜单赋初始值
                $(".typeOptionAppendToRemove").remove();
                for (var i = 0; i < data.typetables.length; i++) {
                    var str = "<option class='typeOptionAppendToRemove' value='" + data.typetables[i].lxName + "'>" + data.typetables[i].lxName + "</option>";
                    $(".typeOptionAppendTo").append(str);
                }
            }
        });
    }

    //初始化规格下拉菜单
    function initializesTheSpecificationTropDownMenu() {
        $.ajax({
            url: 'queryAllSpecificationMassageController', //请求的url
            type: 'post', //请求的方式
            success: function (data) {
                //给页面规格下拉菜单赋初始值
                $(".specificationOptionAppendToRemove").remove();
                for (var i = 0; i < data.specificationtables.length; i++) {
                    var str = "<option class='specificationOptionAppendToRemove' value='" + data.specificationtables[i].ggName + "'>" + data.specificationtables[i].ggName + "</option>";
                    $(".specificationOptionAppendTo").append(str);
                }
            }
        });
    }

    //初始化类型模态框数据
    function initializesTypeModel() {
        $.ajax({
            url: 'queryAllTypeMassageController', //请求的url
            type: 'post', //请求的方式
            success: function (data) {
                $(".typeAppendToRemove").remove();
                for (var i = 0; i < data.typetables.length; i++) {
                    var str = "<tr class='typeAppendToRemove'><td><input onfocus='checkEditTypeMassage(this)' onblur='saveEditTypeMassage(this)' style='width: 100px' name='" + data.typetables[i].lxId + "' type='text' value='" + data.typetables[i].lxName + "'></td><td><a style='color:black;font-size: smaller' href='javascript:void(0)' onclick='deleteType(\"" + data.typetables[i].lxId + "\")'>删除</a></td></tr>";
                    $(".typeAppendTo").append(str);
                }
            }
        });
    }

    //类型模态框
    function showTypeModel() {
        $("#customTypeModel").css("display", "block");  //把隐藏的div可见
        //给类型模态框赋初始值
        initializesTypeModel();
        $("#customTypeModel").dialog({
            title: "类型管理",   //一些属性
            width: 200,
            height: 300,
            top: 50,
            toolbar: [{
                text: "增加",
                iconCls: "icon-add",     //引用此按钮属性，会自动为你的按钮增加样式和图标
                handler: function () {
                    //增加类型模态框
                    $("#addtypemodel").css("display", "block");  //把隐藏的div可见
                    $("#addtypemodel").dialog({
                        title: "增加类型",   //一些属性
                        width: 340,
                        height: 150,
                        top: 50,
                        buttons: [{
                            text: "确认",
                            iconCls: "icon-ok",     //引用此按钮属性，会自动为你的按钮增加样式和图标
                            handler: function () {
                                var addTypeName = document.getElementById("addtypemodelinput").value;
                                $.ajax({
                                    url: 'addTypeMassageController', //请求的url
                                    type: 'post', //请求的方式
                                    data: {"addTypeName": addTypeName},
                                    success: function () {
                                        //增加完刷新下拉菜单
                                        initializesTheTypeTropDownMenu();
                                        //增加完刷新类型管理模态框
                                        initializesTypeModel();
                                        $("#addtypemodel").dialog("close");//关闭对话框
                                        alert("增加成功！");
                                    }
                                });
                            }
                        }, {
                            text: "取消",
                            iconCls: "icon-cancel",     //引用此按钮属性，会自动为你的按钮增加样式和图标
                            handler: function () {
                                $("#addtypemodel").dialog("close");//关闭对话框
                            }
                        }]
                    });
                }
            }]
        });
    }

    //检查点击前文本框的值
    var checkTypeValue;

    function checkEditTypeMassage(obj) {
        checkTypeValue = obj.value;
    }

    //保存编辑后的类型信息
    function saveEditTypeMassage(obj) {
        var checkName = /^\S+$/;
        var lxId = obj.getAttribute("name")
        var lxName = obj.value;
        if (lxName == null || checkName.test(lxName) == false) {
            lxName = checkTypeValue;
            alert("输入不能为空且不能为空格！")
            $.ajax({
                url: 'updateTypeMassageController', //请求的url
                type: 'post', //请求的方式
                data: {"lxId": lxId, "lxName": lxName},
                success: function () {
                    //删除完刷新下拉菜单
                    initializesTheTypeTropDownMenu();
                    //刷新类型管理模态框数据
                    showTypeModel();
                }
            });
        }
        if (lxName != checkTypeValue) {
            $.ajax({
                url: 'updateTypeMassageController', //请求的url
                type: 'post', //请求的方式
                data: {"lxId": lxId, "lxName": lxName},
                success: function () {
                    //删除完刷新下拉菜单
                    initializesTheTypeTropDownMenu();
                    //刷新类型管理模态框数据
                    showTypeModel();
                    alert("编辑成功！");
                }
            });
        }
    }

    //删除类型信息
    function deleteType(lxId) {
        $.ajax({
            url: 'deleteTypeMassageController', //请求的url
            type: 'post', //请求的方式
            data: {"dellxId": lxId},
            success: function () {
                //删除完刷新下拉菜单
                initializesTheTypeTropDownMenu();
                //刷新类型管理模态框数据
                showTypeModel();
                alert("删除成功！");
            }
        });
    }

    //初始化类型模态框数据
    function initializesSpecificationModel() {
        $.ajax({
            url: 'queryAllSpecificationMassageController', //请求的url
            type: 'post', //请求的方式
            success: function (data) {
                $(".specificationAppendToRemove").remove();
                for (var i = 0; i < data.specificationtables.length; i++) {
                    var str = "<tr class='specificationAppendToRemove'><td><input onfocus='checkEditSpecificationMassage(this)' onblur='saveEditSpecificationMassage(this)' style='width: 100px' name='" + data.specificationtables[i].ggId + "' type='text' value='" + data.specificationtables[i].ggName + "'></td><td><a style='color:black;font-size: smaller' href='javascript:void(0)' onclick='deleteSpecification(\"" + data.specificationtables[i].ggId + "\")'>删除</a></td></tr>";
                    $(".specificationAppendTo").append(str);
                }
            }
        });
    }

    //规格模态框
    function showSpecificationModel() {
        $("#customSpecificationModel").css("display", "block");  //把隐藏的div可见
        //给类型模态框赋初始值
        initializesSpecificationModel();
        $("#customSpecificationModel").dialog({
            title: "规格管理",   //一些属性
            width: 200,
            height: 300,
            top: 50,
            toolbar: [{
                text: "增加",
                iconCls: "icon-add",     //引用此按钮属性，会自动为你的按钮增加样式和图标
                handler: function () {
                    $("#addspecificationmodel").css("display", "block");  //把隐藏的div可见
                    $("#addspecificationmodel").dialog({
                        title: "增加规格",   //一些属性
                        width: 340,
                        height: 150,
                        top: 50,
                        buttons: [{
                            text: "确认",
                            iconCls: "icon-ok",     //引用此按钮属性，会自动为你的按钮增加样式和图标
                            handler: function () {
                                var addSpecificationName = document.getElementById("addspecificationmodelinput").value;
                                $.ajax({
                                    url: 'addSpecificationMassageController', //请求的url
                                    type: 'post', //请求的方式
                                    data: {"addSpecificationName": addSpecificationName},
                                    success: function () {
                                        //增加完刷新下拉菜单
                                        initializesTheSpecificationTropDownMenu();
                                        //增加完刷新规格管理模态框
                                        initializesSpecificationModel();
                                        $("#addspecificationmodel").dialog("close");//关闭对话框
                                        alert("增加成功！");
                                    }
                                });
                            }
                        }, {
                            text: "取消",
                            iconCls: "icon-cancel",     //引用此按钮属性，会自动为你的按钮增加样式和图标
                            handler: function () {
                                $("#addspecificationmodel").dialog("close");//关闭对话框
                            }
                        }]
                    });
                }
            }]
        });
    }

    //检查点击前文本框的值
    var checkSpecificationValue;

    function checkEditSpecificationMassage(obj) {
        checkSpecificationValue = obj.value;
    }

    //保存编辑后的规格信息
    function saveEditSpecificationMassage(obj) {
        var checkName = /^\S+$/;
        var ggId = obj.getAttribute("name")
        var ggName = obj.value;
        if (ggName == null || checkName.test(ggName) == false) {
            ggName = checkSpecificationValue;
            alert("输入不能为空且不能为空格！")
            $.ajax({
                url: 'updateSpecificationMassageController', //请求的url
                type: 'post', //请求的方式
                data: {"ggId": ggId, "ggName": ggName},
                success: function () {
                    //刷新下拉菜单
                    initializesTheSpecificationTropDownMenu();
                    //刷新类型管理模态框数据
                    showSpecificationModel();
                }
            });
        }
        if (ggName != checkSpecificationValue) {
            $.ajax({
                url: 'updateSpecificationMassageController', //请求的url
                type: 'post', //请求的方式
                data: {"ggId": ggId, "ggName": ggName},
                success: function () {
                    //刷新下拉菜单
                    initializesTheSpecificationTropDownMenu();
                    //刷新类型管理模态框数据
                    showSpecificationModel();
                    alert("编辑成功！");
                }
            });
        }
    }

    //删除规格信息
    function deleteSpecification(ggId) {
        $.ajax({
            url: 'deleteSpecificationMassageController', //请求的url
            type: 'post', //请求的方式
            data: {"delggId": ggId},
            success: function () {
                //删除完刷新下拉菜单
                initializesTheSpecificationTropDownMenu();
                //刷新类型管理模态框数据
                showSpecificationModel();
                alert("删除成功！");
            }
        });
    }

    // 是否可提交
    function checkSubmit() {
        var wpName = /^[\u4e00-\u9fa5_a-zA-Z0-9]+$/;
        var wpPrice = /^[0-9]+(.[0-9]{2})?$/;
        var goodsname = document.getElementById('goodsname').value;
        var goodsprice = document.getElementById('goodsprice').value;
        var wpType = document.getElementById('wpType').value;
        var wpGgid = document.getElementById('wpGgid').value;
        if (goodsname == "" || wpName.test(goodsname) == false) {
            alert("物品名称不能为空并且只能输入中文、英文、_！");
            return false;
        }
        if (goodsprice == "" || wpPrice.test(goodsprice) == false) {
            alert("价格为数字不能为空并且只含有两位小数！");
            return false;
        }
        if (wpType == '选择物品类型') {
            alert("请选择物品类型！");
            return false;
        }
        if (wpGgid == '选择规格编号') {
            alert("请选择规格编号！");
            return false;
        }
        for (var i = 0; i < els.length; i++) {
            if (!checkFormat(els[i])) {
                alert("请输入正确信息！");
                return false;
            }
        }
        return true;
    }

    //返回菜单按钮
    function back() {
        location = 'goods/look.action';
    }
</script>
</html>
